<!doctype html>
<html>

	<head>
		<meta charset="UTF-8">
		<title>邀请好友</title>
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<link href="css/mui.min.css" rel="stylesheet" />
		<link rel="stylesheet" href="css/iconfont.css" />
		<link rel="stylesheet" href="css/public.css" />
		<style type="text/css">
			html,body{
				height: 100%;
				overflow: hidden;
			}
			.mui-content{
				height: 100%;
			}
			.btn-group{
				position: absolute;
				bottom: 13%;
				left: 0;
				padding:0 42px;
				width: 100%;
			}
			.btn-group .share-btn{
				width: 100%;
				height: 48px;
				display: block;
				border-radius: 6px;
				background: #ffdc3b;
				color: #910500;
				font-size: 15px;
				border: 0;
				margin-bottom: 20px;
			}
			button.share-btn:enabled:active{
				background: #ffdc3b;
				color: #910500;
			}
		</style>
	</head>

	<body>
		<header class="mui-bar mui-bar-nav header">
		    <a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
		    <h1 class="mui-title">邀请好友</h1>
		</header>
		<div class="mui-content" id="app">
			<img src="images/images/share.png" alt="" width="100%" height="100%"/>
			<div class="btn-group">
				<button type="button" id="share" class="share-btn">分享到</button>
				<!--<button type="button" class="share-btn">分享到微信朋友圈</button>-->
			</div>
		</div>
		<script src="js/mui.min.js"></script>
		<script src="js/app.js"></script>
		<script src="vue/vue.min.js"></script>
		<script type="text/javascript">
			(function($,doc){
				$.init();
				var list=document.getElementById("list");
				$.plusReady(function(){
					plus.share.getServices(function(s){
						shares={};
						console.log(JSON.stringify(s))
						for(var i in s){
							var t=s[i];
							shares[t.id]=t;
						}
					}, function(e){
						outSet('获取分享服务列表失败：'+e.message);
					});
					function shareMessage(msg, s){
						console.log(JSON.stringify(msg));
						s.send(msg, function(){
							$.toast('分享到"'+s.description+'"成功！');
						}, function(e){
							$.toast('分享到"'+s.description+'"失败: '+JSON.stringify(e));
						});
					}
					function shareAction(sb,bh) {
						console.log(sb.s)
						if(!sb||!sb.s){
							$.toast('无效的分享服务！');
							return;
						}
						var msg={content:"我正在使用HBuilder+HTML5开发移动应用，赶紧跟我一起来体验！",extra:{scene:sb.x}};
						if(bh){
							msg.href="http://www.dcloud.io/";
							msg.title='你是不是傻';
							msg.content="哈哈哈，你怎么知道";
							msg.thumbs=['_www/logo.png'];
							msg.pictures=['_www/logo.png'];
						}
						// 发送分享
						if(sb.s.authenticated){
							shareMessage(msg, sb.s);
						}else{
							sb.s.authorize(function(){
								shareMessage(msg,sb.s);
							}, function(e){
								$.toast('认证授权失败：'+e.code+' - '+e.message);
							});
						}
					}
					doc.getElementById("share").addEventListener("tap",function(){
						var shareBts=[];
						// 更新分享列表
						var ss=shares['weixin'];
						ss&&ss.nativeClient&&(shareBts.push({title:'微信朋友圈',s:ss,x:'WXSceneTimeline'}),
						shareBts.push({title:'微信好友',s:ss,x:'WXSceneSession'}));
						ss=shares['qq'];
						ss&&ss.nativeClient&&shareBts.push({title:'QQ',s:ss});
						// 弹出分享列表
						shareBts.length>0?plus.nativeUI.actionSheet({title:'分享链接',cancel:'取消',buttons:shareBts},function(e){
							(e.index>0)&&shareAction(shareBts[e.index-1],true);
						}):plus.nativeUI.alert('当前环境无法支持分享链接操作!');
					})
				});
				
				
				
				
				
				
				if($.os.plus){
					
				}else{
					//去掉头部标题栏
					doc.getElementsByClassName("mui-bar-nav")[0].style.display="none";
					doc.getElementById("app").style.paddingTop=0;
				}
				
			}(mui,document));
		</script>
	</body>

</html>